<!--主页面案卷模块-->
<template>
  <div class="floder-card">
    <a-card size="small" :headStyle="{ background: '#f9f9f9' }" :bodyStyle="{ height: 'calc(100% - 48px)' }">
      <div slot="title">
        <div class="top-icon">
          <icon-font type="icon-wj-xgwj-t" />
        </div>
        <span>案卷数据</span>
      </div>
      <div slot="extra">
        <!-- 案卷操作按钮 -->
        <a-dropdown
          v-for="(item, index) in floderVerb"
          :key="index"
          placement="bottomRight"
          class="icon-button">
          <a-button type="primary" :icon="item.icon">{{ item.title }}</a-button>
          <a-menu slot="overlay">
            <template v-for="(list, key) in item.type">
              <a-menu-item :key="key" :disabled="list.status" v-if="list.show" @click="onClickVerb(list.title)">
                <span class="icon iconfont" :class="list.icon" style="margin-right: 6px;"></span>{{ list.title }}
              </a-menu-item>
              <!-- 最后一行没有分割线 -->
              <a-menu-divider :key="list.title" v-if="key!==item.type.length - 1" />
            </template>
          </a-menu>
        </a-dropdown>
      </div>
      <div class="card-table">
        <!-- 案卷表格 -->
        <table-bar
          :tableData="tableData"
          :tableColumns="tableColumns"
          :linkData="floderLinkData"
          @toLink="toLink"
          @textTable="textTable"></table-bar>
      </div>
    </a-card>
  </div>
</template>

<script>
import TableBar from './TableBar'
export default {
  name: '',
  components: {
    TableBar
  },
  props: {
    tableData: { // 案卷表格数据
      type: Array,
      default: () => {
        return []
      }
    },
    tableColumns: { // 案卷表头数据
      type: Array,
      default: () => {
        return []
      }
    },
    floderLinkData: {
      type: Array,
      default: () => {
        return []
      }
    }
  },
  data () {
    return {
      floderVerb: [ // 案卷表格按钮集合
        {
          title: '常规操作',
          icon: 'tool',
          type: [
            { title: '添加案卷', icon: 'icon-tianjiawenjian', status: false, show: true },
            { title: '修改案卷', icon: 'icon-wj-xgwj-t', status: false, show: true },
            { title: '删除案卷', icon: 'icon-shanchuwenjian', status: false, show: true },
            { title: '克隆新增', icon: 'icon-kelong', status: false, show: true },
            { title: '执行触发器', icon: 'icon-chufaqi', status: true, show: true },
            { title: '标记备注', icon: 'icon-biaoji', status: false, show: true },
            { title: '查询归卷', icon: 'icon-chaxun', status: false, show: true },
            { title: '修改分类', icon: 'icon-009xiugaifenlei', status: false, show: true }
          ]
        },
        {
          title: '案卷检索',
          icon: 'search',
          type: [
            { title: '简易搜索', icon: 'icon-soushuo', status: false, show: true },
            { title: '案卷搜索', icon: 'icon-sousuo1', status: false, show: true }
          ]
        },
        {
          title: '案卷大流水',
          icon: 'ordered-list',
          type: [
            { title: '上移', icon: 'icon-xiayi2', status: false, show: true },
            { title: '下移', icon: 'icon-xiayi1', status: false, show: true },
            { title: '转至', icon: 'icon-yizhi', status: false, show: true },
            { title: '重置流水', icon: 'icon-zhongzhi3', status: true, show: true }
          ]
        },
        {
          title: '案卷小流水',
          icon: 'unordered-list',
          type: [
            { title: '上移', icon: 'icon-shangyi', status: false, show: true },
            { title: '下移', icon: 'icon-xiayi', status: false, show: true },
            { title: '转至', icon: 'icon-yizhi1', status: false, show: true },
            { title: '重置流水', icon: 'icon-zhongzhi1', status: true, show: true }
          ]
        },
        {
          title: '锁 | 轨迹',
          icon: 'pull-request',
          type: [
            { title: '案卷锁定', icon: 'icon-suoding', status: false, show: true },
            { title: '案卷解锁', icon: 'icon-jiesuo', status: true, show: true },
            { title: '复制案卷', icon: 'icon-fuzhi', status: true, show: true },
            { title: '粘贴案卷', icon: 'icon-niantie', status: true, show: true },
            { title: '修改轨迹', icon: 'icon-guiji', status: false, show: true }
          ]
        },
        {
          title: '报表导出',
          icon: 'upload',
          type: [
            { title: '案卷目录', icon: 'icon-baobiao', status: false, show: true },
            { title: '案卷批量导出', icon: 'icon-icon', status: true, show: true }
          ]
        }
      ]
    }
  },
  created () {
  },
  mounted () {
  },
  methods: {
    // 案卷级别事件
    onClickVerb (val) {
      this.$emit('floderClick', val)
    },
    // 案卷表格点击查看对应表格下的数据
    toLink (name, row) {
      this.$emit('floderToLink', name, row)
    },
    textTable () {
      this.$emit('textTable')
    }
  }
}
</script>
<style lang="less" scoped>
@import '../../../../assets/icons/iconfont.css';
.floder-card {
  height: 100%;
  .card-table {
    height: 100%;
  }
}
</style>
